<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{:session('cp.cpsysname')}--服务商管理平台</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <meta name="description" content="{:config('webconfig.description');}">
    <meta name="keywords" content="{:config('webconfig.keywords');}">
    <meta name="author" content="runoob">
    <!-------------开关按钮css-------------->
    <link rel="stylesheet" href="__STATIC_URL__/static/css/bootstrapSwitch.css">
    <link rel="stylesheet" href="__STATIC_URL__/static/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="__STATIC_URL__/static/css/index.css"/>
    <link rel="stylesheet" href="__STATIC_URL__/static/css/addmchat.css"/>
    <script src="__STATIC_URL__/static/jquery/2.2.1/jquery.min.js"></script>
    <script src="__STATIC_URL__/static/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="__STATIC_URL__/static/js/bootstrapSwitch.js"></script>
    <script src="__STATIC_URL__/static/js/commen.js" type="text/javascript" charset="utf-8"></script>
    <script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&key=KNPBZ-RXKWI-SJJGI-5S3HH-AGDS6-Q6BDW"></script>
    <script src="__STATIC_URL__/static/js/liandong.js"></script>
    <script>
        //调用poi类信接口
        function searchKeyword() {
            var keyword = document.getElementById("keyword").value;
            region = new qq.maps.LatLng(36.067972, 113.837242);

            searchService.setPageCapacity(5);
            searchService.searchNearBy(keyword, region, 2000);//根据中心点坐标、半径和关键字进行周边检索。
        }
        var searchService,map,markers = [];
        var init = function() {
            var center = new qq.maps.LatLng(36.067972, 113.837242);
            map = new qq.maps.Map(document.getElementById('container'), {
                center: center,
                zoom: 13
            });
            var latlngBounds = new qq.maps.LatLngBounds();
            //调用Poi检索类
            searchService = new qq.maps.SearchService({
                complete : function(results){
                    var pois = results.detail.pois;
                    for(var i = 0,l = pois.length;i < l; i++){
                        var poi = pois[i];
                        latlngBounds.extend(poi.latLng);
                        var marker = new qq.maps.Marker({
                            map:map,
                            position: poi.latLng
                        });
                        marker.setTitle(i+1);
                        markers.push(marker);
                    }
                    map.fitBounds(latlngBounds);
                }
            });
            var marker = new qq.maps.Marker( {
                map : map,
                position : center
            });

            var infoWin = new qq.maps.InfoWindow( {
                map : map
            });
            qq.maps.event.addListener(
                map,
                'click',
                function(event) {
                    $("#latitude").val(event.latLng.getLat());
                    $("#longitude").val(event.latLng.getLng());
                    $.ajax({
                        url:"{:url('store/getaddress')}",
                        type:'post',
                        async: true,
                        data:{
                            lat:event.latLng.getLat(),
                            lng:event.latLng.getLng()
                        },
                        success:function(data){
                            infoWin.open();
                            infoWin.setContent('<div style="text-align:center;white-space:nowrap;margin:10px;">'+data.address+'</div>');
                            infoWin.setPosition(event.latLng);
                            $("#address").val(data.address);
                            $("#province").val(data.address_component.province);
                            $("#city").val(data.address_component.city);
                            $("#district").val(data.address_component.district);
                            $("#street").val(data.address_component.street);
                            $("#street_number").val(data.address_component.street_number);
                        },
                        error:function(){
                            alert("获取地址失败");
                        }
                    })
                }
            );
        }
    </script>
</head>
<body onload="init()">
{include file='public/header'/}
<!------------------导航-------------------------->
<section>
    {include file='public/left'/}
    <!--------------------------主要内容区域------------------------------------->
    <div class="content">
        <div class="page-heading mgl15 mgr15">
            <ul class="breadcrumb">
                <li>当前位置是&nbsp;:</li>
                <li><a href="javascript:history.back();">商户管理</a></li>
                <li class="active" style="color: #02b87f;"> 添加门店</li>
            </ul>
        </div>
        <div class="panel panel-default mgl15 mgr15">
            <div class="panel-heading addCharts" style="background:#ededed;">添加门店</div>
            <div class="panel-body">
                <form class="form-horizontal adminex-form" action="" name="form" method="post" id="mach"
                      enctype="multipart/form-data">
                    <ul id="myTab" class="nav nav-tabs">
                        <li class="active"><a href="#jichu" data-toggle="tab">基础信息</a></li>
                        <li><a href="#weihu" data-toggle="tab">支付信息</a></li>
                    </ul>
                    <div id="myTabContent" class="tab-content" style="padding-top:15px;">
                        <div class="tab-pane fade in active" id="jichu">
                            <div class="form-group" id="ferror1">
                                <label class="col-sm-2 col-sm-2 control-label">门店名称：</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control ipt4" value="{$user['merchant']}" id="merchant" name="merchant">
                                    <div id="error1" class="error"></div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 col-sm-2 control-label">门店LOGO：</label>
                                <div class="col-sm-10">
                                    <input type="file" id="exampleInputFile" onchange="publicUpload('exampleInputFile')">
                                    <input type="hidden" value="{$user['img']}" name="img" class="exampleInputFile-ipt">
                                    {if condition="$user['img'] neq ''"}
                                    <img src="{$user['img']}" class="exampleInputFile-src"  alt="" style="width:150px;height: 150px;margin: 15px auto;float: left;">
                                    {/if}
                                </div>
                            </div>
                            <div class="form-group" id="ferror3">
                                <label class="col-sm-2 col-sm-2 control-label">门店联系人：</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control ipt4" id="contacts" value="{$user['MerchantContent']['contacts']}" name="contacts">
                                    <div id="error3" class="error"></div>
                                </div>
                            </div>
                            <div class="form-group" id="ferror4">
                                <label class="col-sm-2 col-sm-2 control-label">门店电话：</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control ipt4" id="tel" value="{$user['MerchantContent']['tel']}" name="tel">
                                    <div id="error4" class="error"></div>
                                </div>
                            </div>
                            <!--地图坐标-->
                            <div class="form-group hide">
                                <label class="col-sm-2 col-sm-2 control-label">坐标系：</label>
                                <div class="col-sm-10">
                                    <select name="offset_type" class="form-control border-no">
                                        <option value="1">火星坐标</option>
                                        <option value="2">SOGOU经纬度</option>
                                        <option value="3">为百度经纬度</option>
                                        <option value="4">mapbar经纬度</option>
                                        <option value="5">为GPS坐标</option>
                                        <option value="6">SOGOU墨卡托坐标</option>
                                    </select>
                                    <div class="error"></div>
                                </div>
                            </div>

                            <div class="form-group hide">
                                <label class="col-sm-2 col-sm-2 control-label">地理位置经度：</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control" id="longitude" name='longitude' placeholder="火星坐标">
                                    <div class="error"></div>
                                </div>
                            </div>

                            <div class="form-group hide">
                                <label class="col-sm-2 col-sm-2 control-label">地理位置纬度：</label>
                                <div class="col-sm-10">
                                    <input type="text" class="form-control" id="latitude" name='latitude' placeholder="火星坐标">
                                    <div class="error"></div>
                                </div>
                            </div>

                            <div class="form-group">
                                <label class="col-sm-2 col-sm-2 control-label">搜索地点：</label>
                                <div class="col-sm-10">
                                    <input id="keyword" type="textbox" class="form-control ipt4" oninput="searchKeyword()" placeholder="在下方地图上单击地址完成选择">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 col-sm-2 control-label">选取地址：</label>
                                <div class="col-sm-10">
                                    <div id="container" style="height:500px;width: 80%;"></div>
                                </div>
                            </div>

                            <div class="error"></div>
                            <!--地图-end-->
                            <div class="form-group" id="ferror5">
                                <label class="col-sm-2 col-sm-2 control-label">门店地址：</label>
                                <div class="col-sm-10">
                                    <input type="hidden" name="id" value="{$user['id']}">
                                    <input type="hidden" id="province" name="province">
                                    <input type="hidden" id="city" name="city">
                                    <input type="hidden" id="district" name="district">
                                    <input type="hidden" id="street" name="street">
                                    <input type="hidden" id="street_number" name="street_number">
                                    <input type="text" class="form-control ipt6" id="address" name="address" value="{$user['MerchantContent']['address']}">
                                    <div id="error5" class="error"></div>
                                </div>
                            </div>
                            <div class="form-group" id="levelst">
                                <label class="col-sm-2 col-sm-2 control-label">类别：</label>
                                <div class="col-sm-6">
                                    <div class="input-group">
                                        <select class="form-control" id="primary" name="leibie" onchange="second_lb()">
                                            <option value="">请选择类别</option>
                                        </select>
                                        <div class="input-group-addon">-</div>
                                        <select class="form-control" name="leibie2" id="secondary">
                                            <option value="">请选择类别</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group" id="ferror8" style="display: none;">
                                <label class="col-sm-2 col-sm-2 control-label" id="levellb">二级类别：</label>
                                <div class="col-sm-10">
                                    <input type="text" id="level" name="level2" class="form-control ipt4">
                                    <div id="error8" class="error"></div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 col-sm-2 control-label">门店通知设定：</label>
                                <div class="col-sm-10">
                                    <div class="switch switch-small" id="tz_setting" data-animated="true" style="height: 25px;">
                                        <input type="checkbox" name="tz_setting" class="tz_setting" value="1" {if condition="$user['tz_setting'] eq '1' "}checked{/if}/>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 col-sm-2 control-label">是否开启刷卡支付：</label>
                                <div class="col-sm-10">
                                    <div class="switch switch-small" id="is_cartpay" data-animated="true" style="height: 25px;">
                                        <input type="checkbox" name="is_cartpay" value="1" class="is_cartpay" {if condition="$user['is_cartpay'] eq '1' "}checked{/if}/>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="tab-pane fade" id="weihu">
                            <div class="form-group" id="ferror2">
                                <label class="col-sm-2 col-sm-2 control-label">微信商户号：</label>
                                <div class="col-sm-10">
                                    <input type="text" id="sub_mch_id" value="{$user['sub_mch_id']}" name="sub_mch_id" class="form-control ipt4">
                                    <div id="error2" class="error"></div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 col-sm-2 control-label">授权Token：</label>
                                <div class="col-sm-10">
                                    <input type="text" id="ali_merid" name="ali_merid" value="{$user['ali_merid']}" class="form-control ipt4">
                                    <div class="error"></div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 col-sm-2 control-label">口碑门店ID：</label>
                                <div class="col-sm-10">
                                    <input type="text" id="ali_store_id" name="ali_store_id" value="{$user['ali_store_id']}" class="form-control ipt4">
                                    <div class="error"></div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 col-sm-2 control-label">民生银行商户号：</label>
                                <div class="col-sm-10">
                                    <input type="text" id="cmmb_mer_id" name="cmmb_mer_id" value="{$user['cmmb_mer_id']}" class="form-control ipt4">
                                    <div class="error"></div>
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-2 col-sm-2 control-label">通道选择：</label>
                                <label class="checkbox-inline">
                                    <input type="radio" name="shtd" id="optionsRadios3" value="0" {if condition="$user['shtd'] eq '0'"} checked {/if}>官方通道
                                </label>
                                <label class="checkbox-inline">
                                    <input type="radio" name="shtd" id="optionsRadios4" value="1" {if condition="$user['shtd'] eq '1'"} checked {/if}>民生通道
                                </label>
                            </div>
                        </div>
                    </div>
                    <div style="text-align: center">
                        <button type="button" onclick="addform()" class="btn btn-primary">修改商户</button>
                    </div>
                </form>
            </div>
        </div>
        {include file='public/footer'/}
    </div>
</section>
<script type="text/javascript">
    function publicUpload(file) {
        var formData = new FormData();
        formData.append('file', $('#' + file)[0].files[0]);
        formData.append('other',file);
        $.ajax({
            url: "{:url('uploads/machuploads')}",
            type: 'POST',
            cache: false,
            data: formData,
            processData: false,
            contentType: false,
        }).done(function (res) {
            $(".exampleInputFile-src").attr("src",res.pic).removeClass("hide");
            $(".exampleInputFile-ipt").val(res.pic);
        }).fail(function (res) {
            alert("上传失败")
        });
    }
    var primary = document.form.primary;
    var secondary = document.form.secondary;
    function first(){
        //指定first的子元素option的长度
        primary.length=arr_first.length;
        for(var i=0;i<arr_first.length;i++){
            primary.options[i].text=arr_first[i].name;
            primary.options[i].value=arr_first[i].name;
        }
        index = primary.selectedIndex;
        secondary.length=arr_second[index].length;
        for(var i=0;i<arr_second[index].length;i++){
            secondary.options[i].text=arr_second[index][i].name;
            secondary.options[i].value=arr_second[index][i].name;
        }
    };
    function second_lb(){
        //修改一级类别列表中默认选择项		var index=0;
        //一级类别选中下标
        secondary.length=0;
        index = primary.selectedIndex;
        secondary.length=arr_second[index].length;
        for(var i=0;i<arr_second[index].length;i++){
            secondary.options[i].text=arr_second[index][i].name;
            secondary.options[i].value=arr_second[index][i].name;
        }
    }
</script>
<script>
    $(function(){
        //        获取类别
        first();
        $("#tz_setting").on('switch-change',function (e, data) {
            var $el = $(data.el),value = data.value;
            if(value==true){
                $(".tz_setting").val(1);
            }else if(value==false){
                $(".tz_setting").val(0);
            }
        });
        $("#is_cartpay").on('switch-change',function (e, data) {
            var $el = $(data.el),value = data.value;
            if(value==true){
                $(".is_cartpay").val(1);
            }else if(value==false){
                $(".is_cartpay").val(0);
            }
        });
    })
    function addform() {
        $('#ferror1').removeClass('has-error');
        $('#ferror3').removeClass('has-error');
        $('#ferror4').removeClass('has-error');
        $('#ferror5').removeClass('has-error');
        $('#ferror7').removeClass('has-error');
        $('#ferror9').removeClass('has-error');
        $('#error1').text('');
        $('#error2').text('');
        $('#error3').text('');
        $('#error4').text('');
        $('#error5').text('');
        $('#error7').text('');
        $('#error9').text('');
        var merchant = $('#merchant').val();
        var sub_mch_id = $('#sub_mch_id').val();
        var contacts = $('#contacts').val();
        var tel = $('#tel').val();
        var address = $('#address').val();
        var agent = $('#agent').val();
        var merid = $("#ali_merid").val();
        if (merchant === '') {
            $('#ferror1').addClass('has-error');
            $('#error1').text('商户名称不能为空');
            $('#merchant').focus();
            return;
        }
        if (contacts == '') {
            $('#ferror3').addClass('has-error');
            $('#error3').text('商户联系人不能为空');
            $('#contacts').focus();
            return;
        }
        if (tel == '') {
            $('#ferror4').addClass('has-error');
            $('#error4').text('商户联系电话不能为空');
            $('#tel').focus();
            return;
        }
        if (address == '') {
            $('#ferror5').addClass('has-error');
            $('#error5').text('商户地址不能为空');
            $('#address').focus();
            return;
        }
        if (agent == '') {
            $('#ferror7').addClass('has-error');
            $('#error7').text('代理商不能为空');
            $('#agent').focus();
            return;
        }
        $('#mach').submit();
    }
</script>
</body>

</html>
